<template>
    <div class="body">
       <div class="page-breadcrumb">
        <div class="pannel-title">
          <div>
           操作日志 / <font style="color:#4687FF">详情</font> 
          </div>
        </div>
        <div class="back-btn" v-if="$store.state.breadcrumb.isBack" @click="back">返回</div>
      </div>
      <!-- 详情回填 -->
      <div class="card-body">
        <!-- 单位信息 -->
        <div class="form-card">
          <div class="title">
            漏洞详情
          </div>
          <div class="body" >
            <a-form :model="formState" :label-col="formConfig01.labelCol" :wrapper-col="formConfig01.wrapperCol">
              <a-row>
                <a-col :span="6">
                  <a-form-item label="操作者账号">
                    <a-input readonly  v-model:value="formState.loginId" />
                  </a-form-item>
                </a-col>
                <a-col :span="6">
                  <a-form-item label="用户名">
                    <a-input readonly  v-model:value="formState.name" />
                  </a-form-item>
                </a-col>
                <a-col :span="6">
                  <a-form-item label="操作类型">
                    <a-select disabled v-model:value="formState.operType" >
                      <a-select-option v-for="item in operTypes" :key='item' :value="item.id">{{item.name}}</a-select-option>
                    </a-select>
                  </a-form-item>
                </a-col>
                <a-col :span="6">
                  <a-form-item label="日志主题">
                    <a-input readonly v-model:value="formState.subject" />
                  </a-form-item>
                </a-col>
                <a-col :span="6">
                </a-col>
              </a-row>
            </a-form>
          </div>
           <a-form :model="formState" :label-col="formConfig02.labelCol" :wrapper-col="formConfig02.wrapperCol" >
              <a-row>
                <a-col :span="12" >
                  <a-form-item label="更改前信息" >
                    <a-textarea readonly style="height:156px" v-model:value="formState.beforeContent"/>
                  </a-form-item>
                </a-col>
                <a-col :span="12">
                  <a-form-item label="更改后信息">
                    <a-textarea readonly style="height:156px" v-model:value="formState.afterContent" />
                  </a-form-item>
                </a-col>
              </a-row>
            </a-form>
        </div>
      </div>
    </div>
</template>

<script>
import httpRequest from "@/util/httpRequest";
import { useStore } from "vuex";
import baseUtil from "@/util/baseUtil";
export default {
  components: {
  },
  data() {
    return {
      assets:{},
      vulns:{},
      activeKey: "1",
      natureTypeIds: [],
      psIds: [],
      operTypes: [
        { id: "Create", name: "创建" },
        { id: "Edit", name: "编辑" },
        { id: "Delete", name: "删除" },
        { id: "Login", name: "登录" },
        { id: "Other", name: "其它" },
        { id: "subject", name: "设置" },
      ],
      formConfig01: {
        labelCol: {
          span: 6
        },
        wrapperCol: {
          span: 24
        }
      },
      formConfig02: {
        labelCol: {
          span: 3
        },
        wrapperCol: {
          span: 24
        }
      },
      formState: {
        id: null,
        name: "",
        address: "",
        inspectLevel: "", // High重点单位,Medium普通单位
        status: "", // Enabled开启, readonly关闭
        natureTypeId: null, //单位性质编号
        natureTypeName: "", // 单位性质名称
        psId: null, // 辖区派出所编号
        psName: "", // 辖区派出所名称
        resDepartment: "",
        contactName: "",
        contactMobile: "",
        contactEmail: "",
        urls: null, // 域名多个时[,]逗号分割
        ips: "", // IP多个时[,]逗号分割
        assetCount: null, // IP和域名总数
        bugCount: null, // 漏洞总数
        inspectCount: null, // 检验总数
        inspectTime: null, // 最后检验时间
        createTime: "",
        editTime: ""
      },
      pageData: {
        inspectLevel: "",
        keywords: "",
        pageNo: 1
      },
      grid01: {
        pageData: {
          gridType: 1,
          total: 0,
          current: 1,
          firmId: "",
          keywords: "",
          pageNo: "1",
          pageSize: 10
        },
        data: [],
        columns: [
          {
            title: "IP状态",
            dataIndex: "offline",
            key: "offline",
            slots: {
              customRender: "offline"
            }
          },
          {
            title: "IP",
            dataIndex: "value",
            key: "value"
          },
          {
            title: "端口",
            dataIndex: "port",
            key: "port"
          },
          {
            title: "服务协议",
            dataIndex: "protocol",
            key: "protocol"
          },
          {
            title: "组件",
            dataIndex: "layer",
            key: "layer",
            slots: {
              customRender: "layers"
            }
          },
          {
            title: "原始数据",
            dataIndex: "banner",
            key: "banner"
          },
          {
            title: "业务系统",
            dataIndex: "banner",
            key: "banner"
          }
        ]
      },
      grid02: {
        pageData: {
          total: 0,
          gridType: 2,
          current: 1,
          firmId: "",
          keywords: "",
          pageNo: "1",
          pageSize: 10
        },
        data: [],
        columns: [
          {
            title: "网站状态",
            dataIndex: "offline",
            key: "offline",
            slots: {
              customRender: "offline"
            }
          },
          {
            title: "主页地址",
            dataIndex: "value",
            key: "value"
          },
          {
            title: "网站标题",
            dataIndex: "title",
            key: "title"
          },
          {
            title: "组件",
            dataIndex: "layer",
            key: "layer",
            slots: {
              customRender: "layers"
            }
          },
          {
            title: "业务系统",
            dataIndex: "banner",
            key: "banner"
          }
        ]
      },
      grid03: {
        pageData: {
          total: 0,
          gridType: 3,
          current: 1,
          firmId: "",
          keywords: "",
          pageNo: "1",
          pageSize: 10
        },
        data: [
          {
            id: 5,
            vulnName: "HTTP允许TRACE/TRACK方法",
            vulnType: "Sys", // 脆弱点类型: Sys系统漏洞,App应用漏洞
            status: "UnReported", // UnReported未通报, Reported已通报/待处理, Handled已处理/待上传, Uploaded已上传/待确认, Confirmed已确认
            severity: "Medium", // 严重程度: Low低危,Medium中危,High高危
            cnnvd: "CNNVD-200901-175,CNNVD-201001-256,CNNVD-200412-533",
            cve: "CVE-2003-1567,CVE-2004-2320,CVE-2010-0386",
            reportFile: null, // 报告文件
            createTime: "2021-09-21 08:16:18"
          }
        ],
        columns: [
          {
            title: "威胁名称",
            dataIndex: "vulnName",
            key: "vulnName"
          },
          {
            title: "威胁等级",
            dataIndex: "severity",
            key: "severity",
            slots: {
              customRender: "severity"
            }
          },
          {
            title: "威胁类型",
            dataIndex: "vulnType",
            key: "vulnType",
            slots: {
              customRender: "vulnType"
            }
          },
          {
            title: "CVE编号",
            dataIndex: "cve",
            key: "cve"
          },
          {
            title: "CNNVD编号",
            dataIndex: "cnnvd",
            key: "cnnvd"
          },
          {
            title: "发现时间",
            dataIndex: "createTime",
            key: "createTime"
          },
          {
            title: "流程状态",
            dataIndex: "status",
            key: "status",
            slots: {
              customRender: "status"
            }
          },
          {
            title: "操作",
            key: "action",
            slots: {
              customRender: "action"
            }
          }
        ]
      }
    };
  },
  mounted() {
    const store = useStore();
    store.dispatch("setBreadcrumb", { text: "漏洞管理/漏洞详情", isBack: true });
    httpRequest.post("管理员操作日志详情", { id: this.$route.params.id }).then(res => {
      this.formState = res.data;
    });
  },
  methods: {
     back(){
      baseUtil.backPage(this);
    }
  }
};
</script>

<style lang="less" scoped>
.body {
  .card-body {
    padding: 30px;
    margin-top: 10px;
    background: #fff;
    .form-card {
      width: 100%;
      text-align: left;
      .title {
        font-size: 20px;
        font-weight: bold;
        color: #333333;
        border-left: 3px solid #4687ff;
        text-align: left;
        padding-left: 10px;
        &-msg {
          font-size: 16px;
        }
        &-btn {
          float: right;
          padding: 5px 15px;
          font-size: 14px;
          background: #4687ff;
          border-radius: 15px;
          color: #fff;
          .icon {
            float: left;
            margin-top: 2px;
            margin-right: 4px;
          }
        }
        &-btnB {
          float: right;
          padding: 5px 15px;
          font-size: 14px;
          border: 1px solid #cccccc;
          border-radius: 15px;
          color: #333333;
          .icon {
            float: left;
            margin-top: 2px;
            margin-right: 4px;
          }
        }
      }
      .body {
        margin-top: 10px;
      }
    }
  }
}
</style>
